<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content=" user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="x5-fullscreen" content="true">
		<meta name="full-screen" content="yes">


		<title></title>
		
		<link rel="shortcut icon"type="image/x-icon" href="img/stop.jpg" media="screen" />
		<link rel="stylesheet" type="text/css" href="css/index.css"/>
		<link rel="stylesheet" type="text/css" href="css/play-view.css"/>
		<link rel="stylesheet" type="text/css" href="css/mv.css"/>
		<link rel="stylesheet"  type="text/css" href="css/comment.css">
		<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/index.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/search.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/video.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/cookie.js" type="text/javascript" charset="utf-8"></script>
		
	</head>
	<body >
		<div id="content">
			<div class="blur" id="xx" >
	              
			</div>
			<div id="login">
				<div class="login-box">
					<span>QQ邮箱:</span>
			
						<input type="text" class="email" id="email-text">
			
				</div>
				<div class="login-box">
						<span>leyi密码:</span>
					<input type="password" name="" class="password" id="password-text">
				</div>
		         <div class="prmote">
                       错误:请输入正确的邮箱与密码
				 </div>
				<div class="login-box">
					<div id="login-btn"><span>登录</span></div>.
					<div id="registered"><span>注册</span></div>
					<div id="cancel-btn"><span>取消</span></div>
				</div>
			</div>
			<div id="search-logo">
					<canvas id="searchCanvas" width="100px" height="100px">
							您的浏览器不支持canvas
			       </canvas>
			</div>
			<div id="search-text">
					<input type="text" value="" id="search-t"  placeholder=" 单 曲 搜 索" >
			</div>
			<div id="header">
			
				<ul>
						<div id="back">
					       HOME
				        </div>
				  	<li class="header-li"><a href="#">播放页面</a></li>
					<li class="header-li"><a href="#">音乐列表</a></li>
					<li class="header-li"><a href="#">原创MV</a></li>
					<li class="header-li"><a href="#">留言区</a></li>
				</ul>
				<div id="bar">
					
				</div>
			</div>
			<div id="main">
				       
                     <div class="pages">
                        	<div id="bgr-packge">
							<img src="" id="bgr-packge-img" style="height: 100%;width:100%;">
                            </div>
                        
                        
			                 <div id="lyrics">
			                      <ul>
			                      
									  <li class="birght-ly" class="lyrics-li">请先前往音乐列表界面</li>
									  
									  <li class="birght-ly" class="lyrics-li">选择歌曲方可播放</li>
			                      </ul>
			                 </div>
                      </div>
                        	<!--
                            	作者：1828035332@qq.com
                            	时间：2018-08-24
                            	描述：播放器界面
                            -->
				
			 <div class="pages">
			
				<div id="main-title">
					<div class="order">
						
					</div>
						<div class="song">
								歌曲
							
				    	</div>
						<div class="singer">
							
							 <div id="song-left">
									制作团队
							 </div> 
				    	</div>
			
				</div>
				 	<div id="music-list">
						<ul>
								<% for(var i=0;i<data.length;i++){ %>
									<li class="list-li" pname="<%= data[i].name %>" cname="<%= data[i].musician %>">
										<div class="order">
											<%= data[i].number %>
										</div>
										<div class="song">
											<%= data[i].name %>
										</div>
										<div class="singer">
											<%= data[i].musician %>
										</div>
									</li>
								<% } %>
					
                        
						</ul>
						</div>
						 	
			 </div>
							<!--
                        	作者：1828035332@qq.com
                        	时间：2018-08-23
                        	描述：以上是index.html页面的内容；
                        -->
                        
                 
                     <div class="pages" name='MV'>      
						<div id="mv">
						
					     </div>
                      </div>
							
					  <div class="pages" >      
							<div class="send-comment">
						    	<div class="send-comment-bgr"></div>
								<div id="send-comment-left"></div>
								<input type="text" id="send-comment-text" placeholder="发表不少于五个字符的留言..." >
							</div>
							<div id="sumbit">
								提交
							</div>
							<div id="comment-area">
								<% for(var i = 0; i < 6 ; i ++) { %>
										<div class="comment">
											<div class="comment-logo">
												<img src="./img/admin-1.jpg" alt="" >
											</div>
											<div class="comment-content">
												<h1>乐友：<%= comments.comments[i].name.slice(0, 3) %>*@qq.com</h1>
												<p><%= comments.comments[i].content %></p>
											</div>
										</div>
									<%  } %>
								<div id="loading">
									<img src="./img/loading.gif" alt="">
								</div>
							</div>
					</div>
				</div>
			     <div id="footer">
			     	<div id="audio-control">
			     	
			     	     <div class="audio-control">
			     	     	<canvas id="lastM" width="100px" height="100px">
			                                                                      您的浏览器不支持canvas
		                       </canvas>
			     	     </div>
			     	     <div class="audio-control">
			     	     		<canvas id="canvas" width="100px" height="100px">
			                                                                      您的浏览器不支持canvas
		                       </canvas>
			     	     </div>
			     	       <div class="audio-control">
			     	     		<canvas id="nextM" width="100px" height="100px">
			                                                                      您的浏览器不支持canvas
		                       </canvas>
			     	     </div>	
			     	     
			     	</div>
						<div id="audio-player">
			                 <audio id="player" src=''></audio>
							<div id="play-white"class="addTrans">
								
							</div>							   
		
							<div id="play-point" class="addTrans">
								
							</div>
							<div id="play-gray" >
								
		 					</div>
		               </div>
		         <div id="play-way"></div>
				</div>
		</div>

	
		<script src="js/canvas.js" type="text/javascript" charset="utf-8"></script>
		
		<script>
		
			
		</script>
	</body>
</html>
